<!DOCTYPE html>
<html
<head></head>
    <div align="center">
        <span ><b >用户注册</b><br></span>     
         <form action="form_action.asp" method="get">
             <fieldset style="text-align: left; width:60%;" >
                 <legend>身份验证-必填信息</legend>
                <div> 
                    <label style="width: 120px;text-align: right;display: inline-block;">用户名</label>
                 <input type="text" placeholder="请输入用户名" name="username">
                </div>
                <div>
                    <label style="width: 120px;text-align: right;display: inline-block;">密 码</label>
                    <input type="password" id="password" placeholder="请输入密码" name="password"></input>
                </div>
                <div>
                    <label style="width: 120px;text-align: right;display: inline-block;">密码确认</label>
                    <input type="password" placeholder="请再次确认密码" name="confirm_password">
                    <!-- 改为password类型以提高安全性 -->
                </div>
             </fieldset>
         </form>
     </div>
     <div align="center">
         <form action="form_action.asp" method="get">
             <fieldset style="text-align: left; width:60%;" >
                 <legend>身份验证-选填信息</legend>
                 <div> <label style="width: 120px;text-align: right;display: inline-block;">所在城市</label>
                     <input type="text" name="fname"></div>
                     <div><label style="width: 120px;text-align: right;display: inline-block;">工作单位</label>
                         <input type="text"name="fname"></div>
                     <div><label style="width: 120px;text-align: right;display: inline-block;">家庭住址</label>
                         <input type="text"name="fname"></div>           
             </fieldset>
         </form>
     </div>
     <div align="center">
         <form action="#" method="get">
             <fieldset style="text-align: left; width:60%;" >
                 <legend>其他个人信息</legend>
                 <div> <label style="width: 120px;text-align: right;display: inline-block;">性别</label>
                     <select id="group" value="1">
                         <option value="1">男孩</option>
                         <option value="2">女孩</option>
                     </select>
                 </div>
                 <div>
                     <label id="io" style="width: 120px;text-align: right;display: inline-block;">爱好</label>
                     <input type="checkbox"name="io">音乐 <input type="checkbox"name="io">体育 <input type="checkbox"name="io">计算机
                 </div>
                 <div>
                     <label id="pp" style="width: 120px;text-align: right;display: inline-block;">喜欢的公司</label>
                         <input type="radio" name="pp">百度
                         <input type="radio" name="pp">微软中国
                         <input type="radio" name="pp">谷歌中国
                 </div>
                 <div>
                     <label  id="pp" style="width: 120px;text-align: right;display: inline-block;">个人简介</label>
                     <textarea  rows="4"cols="25" ></textarea>
                 </div>           
             </fieldset>
         </form>
     </div>
     <div align="center">
         <form action="#">
             <input type="submit" value="提交您的资料">
             <input type="submit" value="重新填写资料"><br>
             <input type="submit" value="无效按钮" style="color:#7d7a7a">
             <input type="submit" value="回到顶部">
         </form>
     </div>
</body>
</html>
